<template>
	<view>
		<view class="custom-nav" :style="{ paddingTop: statusBarHeight + 'px' }">
			<text class="nav-title">提示</text>
		</view>
		<view class="container">
			<img class="img" src="@/static/index/分享提示.svg" alt="">
			<p class="tip-text">请通过分享链接进入小程序</p>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			statusBarHeight: 0
		}
	},
	onLoad() {
		const systemInfo = uni.getSystemInfoSync();
		this.statusBarHeight = systemInfo.statusBarHeight;
	},
	methods: {
		goBack() {
			uni.navigateBack()
		}
	}
}
</script>

<style lang="scss">
.container {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 40rpx;
	flex-wrap: wrap; /* 允许换行 */
	position: fixed;
    top: 50%;
    transform: translate(0px, -50%);
}

.tip-text {
	font-size: 36rpx;
	color: #303133;
	text-align: center;
	line-height: 1.8;
	font-weight: 500;
}

.custom-nav {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 44px;
	background: linear-gradient(180deg, #4F77FD 0%, #486EF5 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	z-index: 999;
}

.nav-title {
	font-size: 18px;
	font-weight: 500;
	color: rgba(255, 255, 255, 0.9);
}

.back-button {
	position: absolute;
	left: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
}
.img {
	width: 543rpx;
	height: 434rpx;
}
</style>